<template>
	<view>
		<u-navbar :is-back="false" title=" " :border-bottom="false" :background="background"></u-navbar>
		<view class="u-flex user-box u-p-l-30 u-p-r-20 u-p-b-30" @click="goView('/pages/my/info/info')">
			<view class="u-m-r-30">
				<u-avatar :src="photo" size="90"></u-avatar>
			</view>
			<view class="u-flex-1">
				<view class="u-font-36 u-p-b-10">{{userdetail.name}}</view>
				<!-- <view class="u-font-24" v-if="isOperatorAdmin">运营商管理员</view>
				<view class="u-font-24" v-else-if="isFranchiseAdmin">加盟商管理员</view> -->
				<view class="u-font-24" v-if="isStoreAdmin">站点管理员</view>
				<view class="u-font-24" v-else>店员</view>
			</view>
			<view class="u-m-l-10 u-p-10">
				<u-icon name="arrow-right" color="#fff" size="28"></u-icon>
			</view>
		</view>
		<view>
			<u-cell-group>
				<u-cell-item title="修改当前站点信息" @click="goView('/pages/shop/my/create/create?id='+storeId)">
					<u-icon name="edit-pen-fill" slot="icon" class="u-font-32 u-p-r-10"></u-icon>
				</u-cell-item>
			</u-cell-group>
		</view>
		<!-- <view v-if="isOperatorAdmin || isFranchiseAdmin">
			<view class="u-p-l-30 u-p-t-30 u-p-b-10">
				<text class="u-font-24">管理</text>
			</view>
			<u-cell-group>
				<u-cell-item v-if="isOperatorAdmin" title="运营商管理" @click="goView('/pages/admin/menu/menu')">
					<text slot="icon" class="iconfont icon-shanghuliebiao u-font-32 u-p-r-10"></text>
				</u-cell-item>
				<u-cell-item v-if="isOperatorAdmin == false && isFranchiseAdmin == true" title="加盟商管理" @click="goView('/pages/admin/franchise/menu/menu')">
					<text slot="icon" class="iconfont icon-shanghuliebiao u-font-32 u-p-r-10"></text>
				</u-cell-item>
			</u-cell-group>
		</view> -->
		<view class="">
			<view class="u-p-l-30 u-p-t-30 u-p-b-10">
				<text class="u-font-24">其他</text>
			</view>
			<u-cell-group>
				<u-cell-item title="个人设置" @click="goView('/pages/my/info/info')">
					<text slot="icon" class="iconfont icon-shezhi u-font-32 u-p-r-10"></text>
				</u-cell-item>
				<u-cell-item title="切换身份" v-if="userdetail.bindinfo" @click="showIdentities = true">
					<text slot="icon" class="iconfont icon-jiaosequanxian u-font-32 u-p-r-10"></text>
				</u-cell-item>
			</u-cell-group>
		</view>

		<tabbar :current="2"></tabbar>
		
		<!-- 切换身份 -->
		<u-popup v-model="showIdentities" mode="bottom" border-radius="14">
			<identities-list></identities-list>
		</u-popup>
	</view>
</template>

<script>
	import tabbar from '../components/tabbar/tabbar.vue'
	import {
		mapState,
		mapGetters,
		mapActions
	} from 'vuex';
	export default {
		components: {
			tabbar
		},
		data() {
			return {
				background: {
					backgroundColor: '#10beca',
				},
				showIdentities: false
			};
		},
		computed: {
			...mapState({
				userdetail: state => state.userdetail,
				storeId: state => state.storeId,
				franchiseId: state => state.franchiseId,
				operatorId: state => state.operatorid
			}),
			...mapState('shop', {
				// tabbar: state => state.tabbar,
				// webSetting: state => state.webSetting
			}),
			photo() {
				return this.fileURL + this.userdetail.photo
			},
			// 是否运营商管理员
			isOperatorAdmin(){
				try {
					return this.userdetail.bindinfo.operator.ismanager
				} catch (error) {
					//TODO handle the exception
					return false
				}
			},
			// 是否加盟商管理员
			isFranchiseAdmin(){
				try {
					return this.userdetail.bindinfo.operator.franchiselist.find((item)=>item.id == this.franchiseId).ismanager
				} catch (error) {
					//TODO handle the exception
					return false
				}
			},
			// 是否（当前）站点的管理员
			isStoreAdmin(){
				try {
					return this.userdetail.bindinfo.operator.franchiselist.find((item)=>item.id == this.franchiseId).storelist.find((item)=>item.id == this.storeId).ismanager
				} catch (error) {
					//TODO handle the exception
					return false
				}
			}
		},
		onLoad() {
			
		},
		methods: {
			goView(url) {
				uni.navigateTo({
					url: url
				})
			},
			hidePhoneNumber(phoneNumber) {
			    if (!phoneNumber || phoneNumber.length !== 11) {
			      return phoneNumber; // 如果电话号码为空或长度不是11位，直接返回
			    }
			    return phoneNumber.slice(0, 3) + '****' + phoneNumber.slice(7);
			}
		}
	}
</script>

<style lang="scss" scoped>
	.user-box {
		background-color: #10beca;
		color: #fff;
	}
	// 我的服务
	.my-service {
		display: flex;
		flex-wrap: wrap;
	
		// padding: 30rpx 0 0;
		.item {
			width: 25%;
			text-align: center;
			margin: 30rpx 0;
			position: relative;
	
			.name {
				margin-top: 10rpx;
			}
		}
	}
</style>